import { onMounted, onUnmounted,ref } from 'vue'
import useHomeStore from '../stores/modules/homeStore';

const store = useHomeStore();
const topHeight = ref(0);
const clientHeight = ref(0);
const scrollHeight = ref(0);
const isReachBottom = ref(false);
export function scrollLoading() {
    
    const scrollHandler = () => {
        topHeight.value = document.documentElement.scrollTop;
        clientHeight.value = document.documentElement.clientHeight;
        scrollHeight.value = document.documentElement.scrollHeight;
        if (Math.ceil(topHeight.value) + clientHeight.value >= scrollHeight.value) {
            isReachBottom.value = true;
        }
        //调试代码
        // console.log("scrollHandler被调用");
        // console.log(topHeight, clientHeight, scrollHeight);
    }

    //添加监控滚动事件
    onMounted(() => {
        window.addEventListener("scroll", scrollHandler);
    })

    //丢弃监控滚动事件
    onUnmounted(() => {
        window.removeEventListener('scroll', scrollHandler);
    })

    return { topHeight, clientHeight, scrollHeight ,isReachBottom};
}